<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <!--省市联动-->
    <select class="province">
      <option>江西省</option>
      <option>福建省</option>
      <option>湖南省</option>
    </select>
    <select class="city">
        
    </select>
  </body>
  <script>
    let data = {
      江西省: ["南昌市", "赣州市", "九江市"],
      福建省: ["福州市", "厦门市", "泉州市"],
      湖南省: ["长沙市", "湘潭市", "邵阳市"],
    };
    var provinceDom = document.querySelector(".province");
    var cityDom = document.querySelector(".city");

    provinceDom.onchange = function () {
        cityDom.innerHTML = "";
      for (var i = 0; i < data[provinceDom.value].length; i++) {
        var createOption = document.createElement("option");

        createOption.text = data[provinceDom.value][i];
        cityDom.appendChild(createOption);
      }
    };
  </script>
</html>
